import theme from './theme';
import * as echarts from 'echarts/src/echarts';
import 'echarts/src/chart/pie';
import 'echarts/src/component/tooltip';
import 'echarts/src/component/title';
import 'echarts/src/component/legend';
/**
 * @module common/echarts/pie
 * @author ashen
 * @description  饼图，调用initPie方法初始化chart
 * @requires module:common/echarts/theme
 */

/**
 * @param  {Integer} id - 页面id或者class
 * @returns {Object} 图表实例dcChart
 */
export function initPie (id) {
  const dcChart = echarts.init(document.querySelector(id), theme, {renderer: 'canvas'});
  dcChart.showLoading();
  dcChart.setOption(option);
  /*window.addEventListener('resize', function () {
    dcChart.resize();
  });*/
  return dcChart;
};
/** 导出图表配置option*/
export const option = {
  title: {text: ''},
  tooltip: {
    trigger: 'item',
    formatter: '{a} <br/>{b} : {c} ({d}%)'
  },
  legend: {
    show: false,
    orient: 'vertical',
    left: 'left',
    data: []
  },
  series: [
    {
      name: '',
      type: 'pie',
      radius: '55%',
      center: ['50%', '50%'],
      data: [],
      label: {
        normal: {
          show: true,
          color: '#666666',
          position: 'outside',
          formatter: '{b}\n{c}%'
        }
      },
      labelLine: {
        normal: {
          show: true
        }
      },
      itemStyle: {
        emphasis: {
          shadowBlur: 10,
          shadowOffsetX: 0,
          shadowColor: 'rgba(0, 0, 0, 0.5)'
        }
      }
    }
  ]
};
